<template>
  <view class="index-report">
    <view style="height: 0.8rem;"></view>
    <view class="report-box">
      <view class="paddingTxt">举报原因</view>
      <view>
        <van-field
          :value="content"
          placeholder="请输入举报原因"
          :border="false"
          type="textarea"
          :multiple="true"
          :autosize="{ minHeight: 100 }"
          @change="onChange"
        />
      </view>
    </view>
    <view class="bottom-btn">
      <button @tap="submit">提交</button>
    </view>
  </view>
</template>

<script>
import { reportResource } from '@requests/business'
import { getParam, toast, goBack } from '@utils/index'
export default {
  name: 'Report',
  data() {
    return {
      content: ''
    }
  },
  components: {},
  computed: {},
  methods: {
    onChange(event) {
      this.content = event.detail
    },
    submit() {
      reportResource({
        carshop_car_id: getParam('carshop_car_id'),
        accusation_reason: this.content
      }).then(res => {
        toast.success('已收到您的举报，工作人员将立即核实').then(() => {
          goBack()
        })
      })
    }
  }
}
</script>

<style>
.index-report {
  background: #f9f9f9;
  height: 100vh;
}
.report-box {
  background: #fff;
  margin-top: 0.8rem;
}
.bottom-btn {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 1.625rem 0.8rem;
  background: #fff;
  z-index: 99;
}
.bottom-btn button {
  width: 100%;
  background-color: #006cff;
  border: none;
  border-radius: 12px;
  color: #fff;
  font-size: 1.02rem;
}
.paddingTxt {
  padding: 26rpx 30rpx 0;
  font-size: 28rpx;
}
</style>
